-
Notifications
You must be signed in to change notification settings - Fork 2.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(slider): Implement discrete slider and discrete slider with marker #842
Conversation
So there's good news and bad news. 👍 The good news is that everyone that needs to sign a CLA (the pull request submitter and all commit authors) have done so. Everything is all good there. 😕 The bad news is that it appears that one or more commits were authored by someone other than the pull request submitter. We need to confirm that they're okay with their commits being contributed to this project. Please have them confirm that here in the pull request. Note to project maintainer: This is a terminal state, meaning the |
cc36ab2
to
266d972
Compare
CLAs look good, thanks! |
Codecov Report
@@ Coverage Diff @@
## master #842 +/- ##
==========================================
+ Coverage 98.56% 98.58% +0.02%
==========================================
Files 70 70
Lines 3199 3251 +52
Branches 387 393 +6
==========================================
+ Hits 3153 3205 +52
Misses 46 46
Continue to review full report at Codecov.
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks like we need some more branch coverage. Once that passes I'll start the review. 👍
266d972
to
e9fd4a8
Compare
Test improved, please take a look :) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
First pass complete! It looks awesome, just a few comments.
</section> | ||
</main> | ||
<script src="assets/material-components-web.js" charset="utf-8"></script> | ||
<script> | ||
(function() { | ||
setTimeout(function() { | ||
mdc.slider.MDCSlider.attachTo(document.getElementById('hero-slider')); | ||
initDemo(document.getElementById('continuous-slider-example')); | ||
initDemo(document.getElementById('slider-example')); | ||
}, 80); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
unnecessary to use 80
here, we just need it to be called at the end of the execution queue.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We need to keep this one as the style loader we use sometime will not be fully loaded when the page runs to the end of this script. It will unstably have some funny weird effect if they are not initialize correctly. We have similar setup in toolbar
and dialog
.
var value = demoRoot.querySelector('.value'); | ||
var committedValue = demoRoot.querySelector('.committed-value'); | ||
var sliderEl = demoRoot.querySelector('.mdc-slider'); | ||
var slider = new mdc.slider.MDCSlider(sliderEl); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why get rid of continuous
in the classname in the DOM and add continuous
to the variable name here?
Either way works, but we should be consistent
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Currently the demo is set up to have 3 type of slider configured by the same control panel, since the control panel is really long (has max
, min
, rtl
, etc...)
In this case, I do want to select a demoRoot
that differentiate contents from hero part, but also since there are multiple sliders within that wrapper, I removed the continuous
in the class and name the variables to identify which one is which.
Does that answer your question?
packages/mdc-slider/README.md
Outdated
@@ -125,6 +144,31 @@ for the minimum and maximum values, which can always be set. This is to ensure c | |||
The step value can be any positive floating-point number, or `0`. When the step value is `0`, the | |||
slider is considered to not have any step. | |||
|
|||
For discrete slider, it requires to have a step value other than `0`. So if a step is not provided, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should read:
"Discrete sliders are required to have a positive step value other than 0. If a step value of 0 is provided, or no value is provided, the step value will default to 1"
Do we handle negative values?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If you set a step to a negative value, it will throw you an error on your face :p
I will document that part~
packages/mdc-slider/README.md
Outdated
|
||
### Display tracker markers (discrete slider only) | ||
|
||
Discrete slider support display markers on slider track by adding css modifier |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should read:
"Discrete sliders support display markers on their tracks by adding the mdc-slider--display-markers
modifier class to mdc-slider
, and <div class="mdc-slider__track-marker-container"></div>
to the track container."
packages/mdc-slider/foundation.js
Outdated
let numMarkers = (max - min) / step; | ||
|
||
// In case distance between max & min is indivisible to step, | ||
// we place the secondary last marker proportionally at where thumb |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should read: "we place the second to last marker proportionally..."
foundation.setMax(100); | ||
foundation.setMin(0); | ||
foundation.setStep(10); | ||
foundation.setupTrackMarker(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Does this test that setupTrackMarker
doesn't remove or append track markers if there is no HAS_TRACK_MARKER
class on the root?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes sir, 4 tests below.
#setupTrackMarker does execute if discrete slider does not display markers
@@ -600,6 +724,25 @@ test('#setMin updates "aria-valuemin" to the new minimum', () => { | |||
raf.restore(); | |||
}); | |||
|
|||
test('#setMin re-place track markers if slider is discrete and displays markers', () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"replace"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is redo placement equivalent to replace? May be I should totally change how I say it... Any suggestions?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe re-renders?
@@ -668,6 +827,25 @@ test('#setStep updates the slider\'s UI when altering the step value', () => { | |||
raf.restore(); | |||
}); | |||
|
|||
test('#setStep re-place track markers if slider is discrete and displays markers', () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
"replace"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Same above. Question for perfect English speaker :)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
hahaha far from perfect!
@@ -29,11 +29,15 @@ suite('MDCSlider'); | |||
|
|||
function getFixture() { | |||
return bel` | |||
<div class="mdc-slider" tabindex="0" role="slider" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"> | |||
<div class="mdc-slider foo" tabindex="0" role="slider" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add any extraneous class names in the individual test using root.classList.add('foo')
when you're setting up the test. The fixture should be as generic as possible, and any test that needs foo
present should exist in isolation.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Great suggestion!
@@ -232,6 +236,13 @@ test('#stepDown decrements the slider by the step value if no value given and a | |||
assert.equal(component.value, 10); | |||
}); | |||
|
|||
test('adapter#hasClass checks if a class exists on root element', () => { | |||
const {component} = setupTest(); | |||
const hasFoo = component.getDefaultFoundation().adapter_.hasClass('foo'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
See comment above. Remove foo
from the fixture, and refactor the test to looks something like:
const {root, component} = setupTest();
root.classList.add('foo');
assert.isTrue(component.getDefaultFoundation().adapter_.hasClass('foo');
e9fd4a8
to
9b0f2ac
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This looks good to me. Take a look at the last couple comments and then merge it!
9b0f2ac
to
a0dc6d8
Compare
## The devDependency [css-loader](https://github.com/webpack-contrib/css-loader) was updated from `1.0.1` to `2.0.0`. This version is **not covered** by your **current version range**. If you don’t accept this pull request, your project will work just like it did before. However, you might be missing out on a bunch of new features, fixes and/or performance improvements from the dependency update. --- <details> <summary>Release Notes for v2.0.0</summary> <p><a name="user-content-2.0.0"></a></p> <h1><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/compare/v1.0.1...v2.0.0">2.0.0</a> (2018-12-07)</h1> <p>The main <strong>BREAKING CHANGES</strong>:</p> <ul> <li>css modules <strong>are disabled by default</strong>, you need setup their use <code>modules</code> option. You can setup their using <code>local</code> (<code>true</code> is alias for this value) and <code>global</code> (previous behaviour) value. Why it is disabled by default? A lot of developers use <code>css</code> without css modules features and they get performance problems due <code>postcss</code> plugins spend time on analyze and processing file.</li> <li>resolving logic for <code>uls()</code> and <code>import</code> at-rules works the same everywhere, it does not matter whether css modules are enabled (with <code>global</code> and <code>local</code> module) or not. Examples - <code>url('image.png')</code> as <code>require('./image.png')</code>, <code>url('./image.png')</code> as <code>require('./image.png')</code>, <code>url('~module/image.png')</code> as <code>require('module/image.png')</code>.</li> </ul> <h3>Bug Fixes</h3> <ul> <li>broken unucode characters (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/850" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/850/hovercard">#850</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/f599c70">f599c70</a>)</li> <li>correctly processing <code>urls()</code> with <code>?#hash</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/803" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/803/hovercard">#803</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/417d105">417d105</a>)</li> <li>don't break loader on invalid or not exists url or import token (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/827" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/827/hovercard">#827</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/9e52d26">9e52d26</a>)</li> <li>don't duplicate import with same media in different case (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/819" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/819/hovercard">#819</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/9f66e33">9f66e33</a>)</li> <li>emit warnings on broken <code>import</code> at-rules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/806" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/806/hovercard">#806</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/4bdf08b">4bdf08b</a>)</li> <li>handle uppercase <code>URL</code> in <code>import</code> at-rules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/818" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/818/hovercard">#818</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/3ebdcd5">3ebdcd5</a>)</li> <li>inconsistent generate class names for css modules on difference os (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/812" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/812/hovercard">#812</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/0bdf9b7">0bdf9b7</a>)</li> <li>reduce number of <code>require</code> for <code>urls()</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/854" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/854/hovercard">#854</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/3338656">3338656</a>)</li> <li>support deduplication of string module ids (optimization.namedModules) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/789" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/789/hovercard">#789</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/e3bb83a">e3bb83a</a>)</li> <li>support module resolution in <code>composes</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/845" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/845/hovercard">#845</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/453248f">453248f</a>)</li> <li>same <code>urls()</code> resolving logic for <code>modules</code> (<code>local</code> and <code>global</code>) and without modules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/843" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/843/hovercard">#843</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/fdcf687">fdcf687</a>)</li> </ul> <h3>Features</h3> <ul> <li>allow to disable css modules and <strong>disable their by default</strong> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/842" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/842/hovercard">#842</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/889dc7f">889dc7f</a>)</li> <li>disable <code>import</code> option doesn't affect on <code>composes</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/822" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/822/hovercard">#822</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/f9aa73c">f9aa73c</a>)</li> <li>allow to filter <code>urls</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/856" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/856/hovercard">#856</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e702e7">5e702e7</a>)</li> <li>allow to filter <code>import</code> at-rules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/857" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/857/hovercard">#857</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e6034c">5e6034c</a>)</li> <li>emit warning on invalid <code>urls()</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/832" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/832/hovercard">#832</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/da95db8">da95db8</a>)</li> <li>added <code>exportOnlyLocals</code> option (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/824" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/824/hovercard">#824</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/e9327c0">e9327c0</a>)</li> <li>reuse <code>postcss</code> ast from other loaders (i.e <code>postcss-loader</code>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/840" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/840/hovercard">#840</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/1dad1fb">1dad1fb</a>)</li> <li>schema options (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/b97d997">b97d997</a>)</li> </ul> <h3>BREAKING CHANGES</h3> <ul> <li>resolving logic for <code>uls()</code> and <code>import</code> at-rules works the same everywhere, it does not matter whether css modules are enabled (with <code>global</code> and <code>local</code> module) or not. Examples - <code>url('image.png')</code> as <code>require('./image.png')</code>, <code>url('./image.png')</code> as <code>require('./image.png')</code>, <code>url('~module/image.png')</code> as <code>require('module/image.png')</code>.</li> <li>by default css modules are disabled (now <code>modules: false</code> disable all css modules features), you can return old behaviour change this on <code>modules: 'global'</code></li> <li><code>css-loader/locals</code> was dropped in favor <code>exportOnlyLocals</code> option</li> <li><code>import</code> option only affect on <code>import</code> at-rules and doesn't affect on <code>composes</code> declarations</li> <li>invalid <code>@import</code> at rules now emit warnings</li> <li>use <code>postcss@7</code></li> </ul> <h3>Bonus</h3> <ul> <li>code refactoring, updating deps and reusing <code>postcss</code> ast increase performance</li> </ul> </details> <details> <summary>Commits</summary> <p>The new version differs by 67 commits.</p> <ul> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/634ab49c17b284e55e62105109412ebd37e234b5"><code>634ab49</code></a> <code>chore(release): 2.0.0</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/6ade2d0e7c04031c79841f1f741d986430a5aed7"><code>6ade2d0</code></a> <code>refactor: remove unused file (#860)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/e7525c90718018b75321f1e04909d6937b6ad140"><code>e7525c9</code></a> <code>test: nested url (#859)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/7259faa89dc70830d69b7eb7baf4163065b63679"><code>7259faa</code></a> <code>test: css hacks (#858)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e6034cee840d47dbfd9fdede87a152e4cfc466a"><code>5e6034c</code></a> <code>feat: allow to filter import at-rules (#857)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e702e7d2e081b7f6d372f0c967fdfca6a40a584"><code>5e702e7</code></a> <code>feat: allow filtering urls (#856)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/9642aa5ad70282f5a7bef8e95ceefdc834af1af1"><code>9642aa5</code></a> <code>test: css stuff (#855)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/333865645e21c15e8589724317111d9d6badbeba"><code>3338656</code></a> <code>fix: reduce number of require for url (#854)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/533abbe8cf2b937751f3d4501816611a230083d2"><code>533abbe</code></a> <code>test: issue 636 (#853)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/08c551cc78bb484a4f947047cbc46b305e733d7e"><code>08c551c</code></a> <code>refactor: better warning on invalid url resolution (#852)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/b0aa159cbb951774a2c09b37f093dd95d23ebbd3"><code>b0aa159</code></a> <code>test: issue #589 (#851)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/f599c7087466ca293989531805ef367b388d13f1"><code>f599c70</code></a> <code>fix: broken unucode characters (#850)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/1e551f338bf6a22541e3dab7943429b01cae02ab"><code>1e551f3</code></a> <code>test: issue 286 (#849)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/419d27b0836be683a1f0cc786ec47e7f80617842"><code>419d27b</code></a> <code>docs: improve readme (#848)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/d94a698d9d144fb91a9d1fdfb8cd4433e410e70e"><code>d94a698</code></a> <code>refactor: webpack-default (#847)</code></li> </ul> <p>There are 67 commits in total.</p> <p>See the <a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/compare/10c3bc31bedcfffe35a8e65e82397d4dd632f6c0...634ab49c17b284e55e62105109412ebd37e234b5">full diff</a></p> </details> <details> <summary>FAQ and help</summary> There is a collection of [frequently asked questions](https://greenkeeper.io/faq.html). If those don’t help, you can always [ask the humans behind Greenkeeper](https://github.com/greenkeeperio/greenkeeper/issues/new). </details> --- Your [Greenkeeper](https://greenkeeper.io) bot 🌴
…#4153) ## The devDependency [css-loader](https://github.com/webpack-contrib/css-loader) was updated from `1.0.1` to `2.0.0`. This version is **not covered** by your **current version range**. If you don’t accept this pull request, your project will work just like it did before. However, you might be missing out on a bunch of new features, fixes and/or performance improvements from the dependency update. --- <details> <summary>Release Notes for v2.0.0</summary> <p><a name="user-content-2.0.0"></a></p> <h1><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/compare/v1.0.1...v2.0.0">2.0.0</a> (2018-12-07)</h1> <p>The main <strong>BREAKING CHANGES</strong>:</p> <ul> <li>css modules <strong>are disabled by default</strong>, you need setup their use <code>modules</code> option. You can setup their using <code>local</code> (<code>true</code> is alias for this value) and <code>global</code> (previous behaviour) value. Why it is disabled by default? A lot of developers use <code>css</code> without css modules features and they get performance problems due <code>postcss</code> plugins spend time on analyze and processing file.</li> <li>resolving logic for <code>uls()</code> and <code>import</code> at-rules works the same everywhere, it does not matter whether css modules are enabled (with <code>global</code> and <code>local</code> module) or not. Examples - <code>url('image.png')</code> as <code>require('./image.png')</code>, <code>url('./image.png')</code> as <code>require('./image.png')</code>, <code>url('~module/image.png')</code> as <code>require('module/image.png')</code>.</li> </ul> <h3>Bug Fixes</h3> <ul> <li>broken unucode characters (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/850" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/850/hovercard">material-components#850</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/f599c70">f599c70</a>)</li> <li>correctly processing <code>urls()</code> with <code>?#hash</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/803" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/803/hovercard">material-components#803</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/417d105">417d105</a>)</li> <li>don't break loader on invalid or not exists url or import token (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/827" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/827/hovercard">material-components#827</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/9e52d26">9e52d26</a>)</li> <li>don't duplicate import with same media in different case (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/819" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/819/hovercard">material-components#819</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/9f66e33">9f66e33</a>)</li> <li>emit warnings on broken <code>import</code> at-rules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/806" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/806/hovercard">material-components#806</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/4bdf08b">4bdf08b</a>)</li> <li>handle uppercase <code>URL</code> in <code>import</code> at-rules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/818" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/818/hovercard">material-components#818</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/3ebdcd5">3ebdcd5</a>)</li> <li>inconsistent generate class names for css modules on difference os (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/812" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/812/hovercard">material-components#812</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/0bdf9b7">0bdf9b7</a>)</li> <li>reduce number of <code>require</code> for <code>urls()</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/854" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/854/hovercard">material-components#854</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/3338656">3338656</a>)</li> <li>support deduplication of string module ids (optimization.namedModules) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/789" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/789/hovercard">material-components#789</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/e3bb83a">e3bb83a</a>)</li> <li>support module resolution in <code>composes</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/845" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/845/hovercard">material-components#845</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/453248f">453248f</a>)</li> <li>same <code>urls()</code> resolving logic for <code>modules</code> (<code>local</code> and <code>global</code>) and without modules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/843" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/843/hovercard">material-components#843</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/fdcf687">fdcf687</a>)</li> </ul> <h3>Features</h3> <ul> <li>allow to disable css modules and <strong>disable their by default</strong> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/842" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/842/hovercard">material-components#842</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/889dc7f">889dc7f</a>)</li> <li>disable <code>import</code> option doesn't affect on <code>composes</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/822" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/822/hovercard">material-components#822</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/f9aa73c">f9aa73c</a>)</li> <li>allow to filter <code>urls</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/856" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/856/hovercard">material-components#856</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e702e7">5e702e7</a>)</li> <li>allow to filter <code>import</code> at-rules (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/857" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/857/hovercard">material-components#857</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e6034c">5e6034c</a>)</li> <li>emit warning on invalid <code>urls()</code> (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/832" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/832/hovercard">material-components#832</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/da95db8">da95db8</a>)</li> <li>added <code>exportOnlyLocals</code> option (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/824" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/824/hovercard">material-components#824</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/e9327c0">e9327c0</a>)</li> <li>reuse <code>postcss</code> ast from other loaders (i.e <code>postcss-loader</code>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/issues/840" data-hovercard-type="pull_request" data-hovercard-url="/webpack-contrib/css-loader/pull/840/hovercard">material-components#840</a>) (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/1dad1fb">1dad1fb</a>)</li> <li>schema options (<a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/b97d997">b97d997</a>)</li> </ul> <h3>BREAKING CHANGES</h3> <ul> <li>resolving logic for <code>uls()</code> and <code>import</code> at-rules works the same everywhere, it does not matter whether css modules are enabled (with <code>global</code> and <code>local</code> module) or not. Examples - <code>url('image.png')</code> as <code>require('./image.png')</code>, <code>url('./image.png')</code> as <code>require('./image.png')</code>, <code>url('~module/image.png')</code> as <code>require('module/image.png')</code>.</li> <li>by default css modules are disabled (now <code>modules: false</code> disable all css modules features), you can return old behaviour change this on <code>modules: 'global'</code></li> <li><code>css-loader/locals</code> was dropped in favor <code>exportOnlyLocals</code> option</li> <li><code>import</code> option only affect on <code>import</code> at-rules and doesn't affect on <code>composes</code> declarations</li> <li>invalid <code>@import</code> at rules now emit warnings</li> <li>use <code>postcss@7</code></li> </ul> <h3>Bonus</h3> <ul> <li>code refactoring, updating deps and reusing <code>postcss</code> ast increase performance</li> </ul> </details> <details> <summary>Commits</summary> <p>The new version differs by 67 commits.</p> <ul> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/634ab49c17b284e55e62105109412ebd37e234b5"><code>634ab49</code></a> <code>chore(release): 2.0.0</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/6ade2d0e7c04031c79841f1f741d986430a5aed7"><code>6ade2d0</code></a> <code>refactor: remove unused file (material-components#860)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/e7525c90718018b75321f1e04909d6937b6ad140"><code>e7525c9</code></a> <code>test: nested url (material-components#859)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/7259faa89dc70830d69b7eb7baf4163065b63679"><code>7259faa</code></a> <code>test: css hacks (material-components#858)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e6034cee840d47dbfd9fdede87a152e4cfc466a"><code>5e6034c</code></a> <code>feat: allow to filter import at-rules (material-components#857)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/5e702e7d2e081b7f6d372f0c967fdfca6a40a584"><code>5e702e7</code></a> <code>feat: allow filtering urls (material-components#856)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/9642aa5ad70282f5a7bef8e95ceefdc834af1af1"><code>9642aa5</code></a> <code>test: css stuff (material-components#855)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/333865645e21c15e8589724317111d9d6badbeba"><code>3338656</code></a> <code>fix: reduce number of require for url (material-components#854)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/533abbe8cf2b937751f3d4501816611a230083d2"><code>533abbe</code></a> <code>test: issue 636 (material-components#853)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/08c551cc78bb484a4f947047cbc46b305e733d7e"><code>08c551c</code></a> <code>refactor: better warning on invalid url resolution (material-components#852)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/b0aa159cbb951774a2c09b37f093dd95d23ebbd3"><code>b0aa159</code></a> <code>test: issue material-components#589 (material-components#851)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/f599c7087466ca293989531805ef367b388d13f1"><code>f599c70</code></a> <code>fix: broken unucode characters (material-components#850)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/1e551f338bf6a22541e3dab7943429b01cae02ab"><code>1e551f3</code></a> <code>test: issue 286 (material-components#849)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/419d27b0836be683a1f0cc786ec47e7f80617842"><code>419d27b</code></a> <code>docs: improve readme (material-components#848)</code></li> <li><a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/commit/d94a698d9d144fb91a9d1fdfb8cd4433e410e70e"><code>d94a698</code></a> <code>refactor: webpack-default (material-components#847)</code></li> </ul> <p>There are 67 commits in total.</p> <p>See the <a href="https://urls.greenkeeper.io/webpack-contrib/css-loader/compare/10c3bc31bedcfffe35a8e65e82397d4dd632f6c0...634ab49c17b284e55e62105109412ebd37e234b5">full diff</a></p> </details> <details> <summary>FAQ and help</summary> There is a collection of [frequently asked questions](https://greenkeeper.io/faq.html). If those don’t help, you can always [ask the humans behind Greenkeeper](https://github.com/greenkeeperio/greenkeeper/issues/new). </details> --- Your [Greenkeeper](https://greenkeeper.io) bot 🌴 (cherry picked from commit 4afb87c)
Closes #25